<div *ngIf="messageService.messages.length">

  <!--
  *ngIf 只有在有消息时才会显示消息区。
  *ngFor 用来在一系列 <div> 元素中展示消息列表。
  Angular 的事件绑定把按钮的 click 事件绑定到了 MessageService.clear()。
  -->
  <h2>Messages</h2>
  <button class="clear"
          (click)="messageService.clear()">clear</button>
  <div *ngFor='let message of messageService.messages'> {{message}} </div>

</div>